<template>
	<view class="main dispaly-col-center">
		<view class="box dispaly-col-center">
			<view class="logo">
				<image src="/static/logo1.jpg" mode="aspectFill" />
			</view>
			<view class="dispaly-col-center">
				<view class="btn-box1">
					<!-- v-if="proxy" -->
					<button class="btn1 b" v-if="isAoth" open-type="getPhoneNumber" @getphonenumber="getphonenum">一键登录</button>
					<view class="btn1 b" v-else @click="login">一键登录</view>
				</view>
			</view>
		</view>
		<!-- 	<view class="proxy w-100 dispaly-align-center">
			<view @click="proxy = !proxy" class="q dispaly-align-center">
				<view class="p" v-if="proxy"></view>
			</view>
			<view class="txt">
				登录即代表已同意
				<text class="a">服务协议，</text>
				<text class="a">隐私政策</text>
			</view>
		</view> -->
	</view>
</template>

<script setup>
import { reactive, ref } from 'vue';
import { onShow } from '@dcloudio/uni-app';
import { codeLogin, telLogin } from '@/api/apiList.js';
import { debounce } from '@/utils/util.js';

let proxy = ref(false);
let loginType = ref(true);

onShow(async () => {
	loginCode();
});

let isAoth = ref();
let openId = ref();
let wxCode = ref('');

const loginCode = () => {
	return new Promise((resolve, reject) => {
		uni.login({
			success: async (result) => {
				wxCode.value = result.code;
				const resultData = await codeLogin({ wxCode: wxCode.value });
				if (resultData.code == 200) {
					if (resultData.getPhone) {
						isAoth.value = resultData.getPhone;
						openId.value = resultData.openId;
					} else {
						resolve(resultData.token);
						uni.setStorageSync('token', resultData.token);
					}
				}
			}
		});
	});
};

const login = debounce(
	async () => {
		uni.showLoading({
			title: '登录中'
		});
		const res = await loginCode();
		console.log(res, 'res');
		if (res) {
			uni.hideLoading();
			uni.showToast({
				title: '登录成功',
				icon: 'none'
			});
			setTimeout(() => {
				// uni.navigateBack();
				uni.reLaunch({
					url: '/pages/index/index'
				});
			}, 1000);
		}

		// if (!proxy.value) {
		// 	uni.showToast({
		// 		title: '请先同意协议！',
		// 		icon: 'none'
		// 	});
		// }
	},
	1000,
	true
);

const getphonenum = async (e) => {
	if (e.detail.errMsg == 'getPhoneNumber:ok') {
		let data = {
			phoneCode: e.detail.code,
			openId: openId.value
		};
		console.log(data, 't');
		uni.showLoading({
			mask: true,
			title: '登录中'
		});
		const res = await telLogin(data);
		if (res.code == 200) {
			console.log(res, 'yyyy');
			uni.setStorageSync('token', res.token);
			uni.showToast({
				title: res.msg,
				icon: 'none'
			});
			uni.hideLoading();
			setTimeout(() => {
				uni.reLaunch({
					url: '/pages/index/index'
				});
				// uni.navigateBack();
			}, 1000);
		} else {
			uni.showToast({
				title: res.msg,
				icon: 'none'
			});
			uni.hideLoading();
		}
	}
};
</script>

<style>
page {
	height: 100vh;
	background: rgb(245, 152, 94);
	background: linear-gradient(180deg, rgba(245, 152, 94, 1) 0%, rgba(255, 128, 102, 1) 0%, rgba(239, 197, 176, 1) 43%, rgba(255, 255, 255, 1) 100%, rgba(249, 142, 95, 1) 100%);
}
</style>

<style lang="scss" scoped>
.btn1 {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 612rpx;
	height: 98rpx;
	border-radius: 12rpx 12rpx 12rpx 12rpx;
	font-family: PingFang SC, PingFang SC;
	font-weight: 400;
	font-size: 28rpx;
}

.b {
	background: linear-gradient(0deg, #f49a5e 0%, #fe4f56 100%);
	color: #ffffff;
}

.main {
	height: 100vh;

	.box {
		.logo {
			image {
				width: 174rpx;
				height: 174rpx;
				border-radius: 12rpx;
			}
		}

		.btn-box1 {
			margin-top: 102rpx;

			.btn1:first-child {
				margin-bottom: 40rpx;
			}
		}

		.tel {
			font-family: PingFang SC, PingFang SC;
			font-weight: 800;
			font-size: 48rpx;
			color: #485658;
			margin-top: 187rpx;
		}
	}
}

.proxy {
	position: fixed;
	bottom: 73rpx;
	left: 0;
	right: 0;

	.q {
		width: 27rpx;
		height: 27rpx;
		border-radius: 50%;
		border: 1rpx solid #d65554;
		margin-right: 10rpx;

		.p {
			width: 20rpx;
			height: 20rpx;
			background-color: #d65554;
			border-radius: 50%;
		}
	}

	.txt {
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #b5b5b5;

		.a {
			color: #d65554;
		}
	}
}
</style>
